﻿<UserControl x:Class="Gallery.Controls.SelectableItemsControl.SelectableItemsControlView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:apexControls="clr-namespace:Apex.Controls;assembly=Apex.Silverlight"
             xmlns:selectableItemsControl="clr-namespace:Gallery.Controls.SelectableItemsControl"
             xmlns:apexConverters="clr-namespace:Apex.Converters;assembly=Apex.Silverlight"
             mc:Ignorable="d" 
             d:DesignHeight="600" d:DesignWidth="800">

    <UserControl.Resources>
        <ResourceDictionary Source="/Gallery.Silverlight;component/Resources/ResourceDictionaries/GalleryResources.xaml" />
    </UserControl.Resources>

    <UserControl.DataContext>
            <selectableItemsControl:SelectableItemsControlViewModel />
        </UserControl.DataContext>

    <Grid Style="{StaticResource GalleryItemStyle}">

        <apexControls:PaddedGrid Rows="Auto,Auto,*,Auto" Padding="4">

            <!-- Title section. -->
            <TextBlock Grid.Row="0" Style="{StaticResource Heading1}">SELECTABLEITEMSCONTROL</TextBlock>
            <TextBlock Grid.Row="1" Style="{StaticResource Subtitle}">
            The SelectableItemsControl is essentially an ItemsControl that supports selection of items.
            </TextBlock>

            <!-- Sample zone. -->
            <Grid Row="2" Margin="16" MaxWidth="600" MaxHeight="800">

                <Grid.Resources>
                    <apexConverters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
                </Grid.Resources>

                <apexControls:ApexGrid Rows="Auto,*">

                    <!-- The top row, a set of selectable items. -->
                    <apexControls:SelectableItemsControl 
                    ItemsSource="{Binding SelectableItems}"
                    SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
                    ClickToSelectItem="True"
                    Background="#E9E9E9">
                        <apexControls:SelectableItemsControl.ItemsPanel>
                            <ItemsPanelTemplate>
                                <StackPanel Orientation="Horizontal"></StackPanel>
                            </ItemsPanelTemplate>
                        </apexControls:SelectableItemsControl.ItemsPanel>
                        <apexControls:SelectableItemsControl.ItemTemplate>
                            <DataTemplate>
                                <Grid MinWidth="80" Background="Transparent" Cursor="Hand">
                                    <TextBlock Style="{StaticResource Heading3}" Margin="4" Text="{Binding Title}" FontWeight="Bold" HorizontalAlignment="Center"
                                      Visibility="{Binding IsSelected, Converter={StaticResource BooleanToVisibilityConverter}}"  />
                                    <TextBlock Style="{StaticResource Heading3}" Margin="4" Text="{Binding Title}" HorizontalAlignment="Center" Foreground="#787878"
                                      Visibility="{Binding IsSelected, Converter={StaticResource BooleanToVisibilityConverter}, ConverterParameter=Invert}"  />
                                </Grid>
                            </DataTemplate>
                        </apexControls:SelectableItemsControl.ItemTemplate>
                    </apexControls:SelectableItemsControl>
                    <Grid Grid.Row="2" Background="White">
                        <TextBlock TextWrapping="Wrap" Padding="10" Text="{Binding SelectedItem.Details}" />
                    </Grid>

                </apexControls:ApexGrid>
            </Grid>
        </apexControls:PaddedGrid>
    </Grid>
</UserControl>